5 -  Control Flow

If / else

You've learned about if and else, and how they control what your program does. Here's a quick refresher on the syntax:

if (/* Some condition */) {
    // Do something
} else if (/* Some other condition */) {
    // Do something else
} else {    // Otherwise
    // Do a third thing
}

Write an if / else statement inside the isEven function. It should returntrue; if the number it receives is evenly divisible by 2. Otherwise (else), it should return false;.

Make sure to return - don't useconsole.log()!

function isEven(value){
    if (value % 2 == 0){
        return true
    }
    else
    {
        return false
    }
}
If / else if / else

Good! Let's also get some practice in with else if, as well as learn about a fancy new function: isNaN.

If you call isNaN on something, it checks to see if that thing is not a number. So:

isNaN('berry'); // => true
isNaN(NaN); // => true
isNaN(undefined); // => true
isNaN(42);  // => false

Be careful: if you call isNaN on a string that looks like a number, like'42', JavaScript will try to help by automatically converting the string'42' to the number 42 and returnfalse (since 42 is a number).

Note that you can't just do

isNaN(unicorns);
unless you've already defined the variable unicorns. You can, however, do
isNaN("unicorns"); // => true
Add an else if branch to your existing if/else statement. If thenumber put into the function is not a number at all, instead of returntrue; or return false;, the function should return a string that tells the user that their input isn't a number. (This string can say whatever you like.)
function isEven(value){
    if (isNaN(value) == true){
        return("Not a number");
    }
    else if (value % 2 == 0){
        return true;
    }
    else
    {
        return false;
    }
}
Sneak preview: the switch statement

As you might imagine, if you have a lotof choices you want to cover in a program, it might be annoying to typeelse if () ten times. That's why JavaScript has the switch statement!

switch allows you to preset a number of options (called cases), then check an expression to see if it matches any of them. If there's a match, the program will perform the action for the matching case; if there's no match, it can execute a default option.

var lunch = prompt("What do you want for lunch?","Type your lunch choice here");
switch(lunch){
  case 'sandwich':
    console.log("Sure thing! One sandwich, coming up.");
    break;
  case 'soup':
    console.log("Got it! Tomato's my favorite.");
    break;
  case 'salad':
    console.log("Sounds good! How about a caesar salad?");
    break;
  case 'pie':
    console.log("Pie's not a meal!");
    break;
  default:
    console.log("Huh! I'm not sure what " + lunch + " is. How does a sandwich sound?");
}
Adding to an existing switch

The switch statement is put together like this:

switch (/*Some expression*/) {
    case 'option1':
        // Do something
        break;
    case 'option2':
        // Do something else
        break;
    case 'option3':
        // Do a third thing
        break;
    default:
       // Do yet another thing
}
JavaScript will try to match the expression between the switch()parentheses to each case. It will run the code below each case if it finds a match, and will execute the defaultcode if no match is found.

Our switch statement needs a casefor 'yellow'. Add it in and make it log a string of your choice to the console (it should be different from the defaultstring).

Don't forget to end your case with abreak statement—otherwise, it will go on and execute the code for default, too! We don't want that.

var color = prompt("What's your favorite primary color?","Type your favorite color here");
switch(color) {
  case 'red':
    console.log("Red's a good color!");
    break;
  case 'blue':
    console.log("That's my favorite color, too!");
    break;
  //Add your case here!
  case 'yellow':
      console.log("Yellow is a good color!");
      break;
  
  
  default:
    console.log("I don't think that's a primary color!");
}
Practice with switch

Now that you've added cases to an existing switch, let's practice adding adefault block.

Add the default block at the bottom of the switch statement, then run the code a few times with different inputs.switch: super useful!
var candy = prompt("What's your favorite candy?","Type your favorite candy here.");
switch(candy) {
  case 'licorice':
    console.log("Gross!");
    break;
  case 'gum':
    console.log("I like gum!");
    break;
  case 'beets':
    console.log("...is that even a candy?");
    break;
  // Add your code here!
  default:
    console.log("Error error error");
}
More practice with switch

You know what they say: practice makes perfect!

We've given you the empty skeleton of a switch statement. Complete the existing case, then add at least one additional case and a defaultbehavior with whateverconsole.log() calls you like.
var answer = prompt("Add your question here!");
switch(answer) {
  case '':
    console.log();
    break;
  // Add your code here!
  case 'hello':
      console.log("A good day to you too!");
      break;
    default:
        console.log("Try again!");
}
Mid-lesson breather

Well done! Even though we've been focusing on switch, we've covered a lot so far. You've:

  • Reviewed if/else if/else
  • Reviewed for and while
  • Learned about the switchstatement and how to use it instead of multiple if/elses
  • Covered switch syntax
  • Written your own switch!
Overview

So far we've seen how to control our programs given a single condition: whether one variable is equal to a certain value, for instance. But what if we want to check more than one variable?

For this, we'll need logical operators. JavaScript has three: and (&&), or(||), and not (!).

Using these, we can check several variables at once! Check out the code in the editor.

// Complete lines 3 and 4!
var iLoveJavaScript = true;
var iLoveLearning = true;
if(iLoveJavaScript && iLoveLearning) {
  // if iLoveJavaScript AND iLoveLearning:
  console.log("Awesome! Let's keep learning!");
} else if(!(iLoveJavaScript || iLoveLearning)) {
  // if NOT iLoveJavaScript OR iLoveLearning:
  console.log("Let's see if we can change your mind.");
} else {
  console.log("You only like one but not the other? We'll work on it.");
}
And

The logical operator and is written in JavaScript like this: &&. It evaluates totrue when both expressions aretrue; if they're not, it evaluates tofalse.

true && true;    // => true
true && false;   // => false
false && true;   // => false
false && false;  // => false
Create two variables, hungry andfoodHere, and set them both equal totrue. Inside the eat function, create an if statement that returns trueonly if both hungry and foodHere aretrue, and false otherwise. The function eat should take no input andhungry and foodHere should both be globals.
// Declare your variables here!
var hungry = true;
var foodHere = true;
var eat = function() {
  // Add your if/else statement here!
  if (hungry && foodHere == true){
      return true;
  }
  else
  {
      return false;
  }
};
Or

The logical operator or is written in JavaScript like this: ||. It evaluates totrue when one or the other or bothexpressions are true; if they're not, it evaluates to false.

true || true;     // => true
true || false;    // => true
false || true;    // => true
false || false;   // => false
The or operator is written with two vertical bars ||. The vertical bar character is located right above the Enter key on your keyboard.
Create two variables, tired andbored, and set one equal to true and the other equal to false. (It doesn't matter which is which.) Inside the napfunction, create an if statement that returns true if either tired orbored (or both!) are true, and falseotherwise.
// Declare your variables here!
var tired = true;
var bored = false;
var nap = function() {
  // Add your if/else statement here!
  if(tired || bored == true){
      return true;
  }
  else
  {
      return false;
  }
};
Not

The logical operator not is written in JavaScript like this: !. It makes trueexpressions false, and vice-versa.

!true;   // => false
!false;  // => true
Declare a variable called programmingand set it to false. Then, write an if/else statement inside happy so thathappy returns true if programming isfalse and false otherwise.
// Declare your variables here!
var programming = false;
var happy = function() {
  // Add your if/else statement here!
  if (programming == !true){
      return true;
  }
  else
  {
      return false;
  }
};
Review

Well done! That last one was particularly tricky.

In this lesson you:

  • Reviewed control flow syntax
  • Learned about the switchstatement
  • Learned about the logical operatorsand (&&), or (||), and not (!)